import { useIntervalFn } from '@vueuse/core'
import { ref, onUnmounted } from 'vue'
import dayjs from 'dayjs'

/**
 * 30分钟支付倒计时函数
 */
export const usePayTime = () => {
    // 倒计时逻辑
    const time = ref(1800) // 30分钟 = 1800秒
    const timeText = ref('')

    // 使用 useIntervalFn 设置一个每秒执行一次的定时器
    const { pause } = useIntervalFn(() => {
        time.value--
        timeText.value = dayjs.unix(time.value).format('mm分ss') // 修改格式以更简洁地显示
        if (time.value <= 0) {
            pause() // 当倒计时结束时停止定时器
        }
    }, 1000, { immediate: true }) // immediate: true 表示立即开始执行一次

    // 在组件卸载时停止定时器
    onUnmounted(() => {
        pause()
    })

    // 无需外部控制开始，因为已经在内部初始化了
    // 如果需要重置倒计时，可以添加一个 reset 方法
    const reset = () => {
        time.value = 1800
        timeText.value = dayjs.unix(time.value).format('mm分ss')
        // 由于 useIntervalFn 的内部逻辑，resume 会被自动调用（如果定时器没有手动暂停的话）
        // 在这里我们不需要显式调用 resume，因为定时器在 time.value 更新后会自动继续
    }

    return {
        timeText,
        reset // 可选：提供一个重置倒计时的方法
    }
}